<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>LUXURY BRANDS</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <header>
        <nav class="top-nav">
            <div class="nav-left">
                <button class="menu-btn">Menu</button>
                <button class="search-btn">Search</button>
            </div>
            <div class="logo">
                <a href="/">LUXURY BRANDS</a>
            </div>
            <div class="nav-right">
                <button class="call-btn">Call Us</button>
                <button class="wishlist-btn">Wishlist</button>
                <button class="account-btn">Account</button>
                <button class="cart-btn">Cart</button>
            </div>
        </nav>
    </header>

    <main>
        <div class="category-nav">
            <ul>
                <li class="active"><a href="/">All Brands</a></li>
                <li><a href="lv-products.html">Louis Vuitton</a></li>
                <li><a href="dior-products.html">Dior</a></li>
                <li><a href="chanel-products.html">Chanel</a></li>
                <li><a href="hermes-products.html">Hermès</a></li>
                <li><a href="gucci-products.html">Gucci</a></li>
            </ul>
        </div>

        <div class="brands-grid">
            <a href="lv-products.html" class="brand-card">
                <div class="brand-image">
                    <img src="https://www.louisvuitton.com/images/is/image/lv/1/PP_VP_L/louis-vuitton--U_Home_Push_Women_FW23.jpg" alt="Louis Vuitton Collection">
                </div>
                <div class="brand-content">
                    <h2>Louis Vuitton</h2>
                    <p>French luxury fashion house and company founded in 1854</p>
                </div>
            </a>
            
            <a href="dior-products.html" class="brand-card">
                <div class="brand-image">
                    <img src="https://www.dior.com/couture/ecommerce/media/catalog/product/V/V/1686816033_M0446CTZQ_M928_E03_ZH.jpg" alt="Dior Collection">
                </div>
                <div class="brand-content">
                    <h2>Dior</h2>
                    <p>French luxury fashion house controlled by LVMH</p>
                </div>
            </a>
            
            <a href="chanel-products.html" class="brand-card">
                <div class="brand-image">
                    <img src="https://www.chanel.com/images/q_auto,f_auto,fl_lossy,dpr_auto/w_1920/FSH-1708523045447-desktopmodule.jpg" alt="Chanel Collection">
                </div>
                <div class="brand-content">
                    <h2>Chanel</h2>
                    <p>French luxury fashion house founded by Coco Chanel</p>
                </div>
            </a>
            
            <a href="hermes-products.html" class="brand-card">
                <div class="brand-image">
                    <img src="https://www.hermes.com/sites/default/files/styles/max_width_1440/public/2024-01/PUSH_FEMME_PE24_1.jpg" alt="Hermès Collection">
                </div>
                <div class="brand-content">
                    <h2>Hermès</h2>
                    <p>French luxury goods manufacturer established in 1837</p>
                </div>
            </a>
            
            <a href="gucci-products.html" class="brand-card">
                <div class="brand-image">
                    <img src="https://media.gucci.com/content/DiaryHeroArticle_Standard_1536x2150/1705507204/DiaryHeroArticle_Gucci-Ancora-Collection-01_001_Default.jpg" alt="Gucci Collection">
                </div>
                <div class="brand-content">
                    <h2>Gucci</h2>
                    <p>Italian luxury fashion house founded in 1921</p>
                </div>
            </a>
        </div>
    </main>

    <footer>
        <div class="footer-content">
            <div class="footer-section">
                <h3>HELP</h3>
                <p>Please reach our client services team at <a href="tel:+85281001182" class="phone-number">+852 8100 1182</a>, <a href="#" class="whatsapp">WhatsApp</a> or <a href="#" class="click-here">click here</a> for more information.</p>
                <a href="#">FAQ</a>
                <a href="#">Product Care</a>
                <a href="#">Stores</a>
            </div>

            <div class="footer-section">
                <h3>SERVICES</h3>
                <a href="#">Repair and Maintenance</a>
                <a href="#">Personalization</a>
                <a href="#">Art of Gifting</a>
                <a href="#">Download our Apps</a>
            </div>

            <div class="footer-section">
                <h3>ABOUT LOUIS VUITTON</h3>
                <a href="#">Fashion Shows</a>
                <a href="#">Arts & Culture</a>
                <a href="#">La Maison</a>
                <a href="#">Sustainability</a>
                <a href="#">Latest News</a>
                <a href="#">Jobs</a>
                <a href="#">Foundation Louis Vuitton</a>
            </div>

            <div class="footer-section">
                <h3>CONNECT</h3>
                <p class="signup-text">Sign up for Louis Vuitton emails and receive the latest news from the Maison, including Exclusive Digital Prelaunch and new collections.</p>
                <p>Follow Us</p>
            </div>
        </div>
    </footer>

    <script src="js/main.js"></script>
</body>
</html> 